@storybook/api

What is @storybook/api?

The @storybook/api package is a part of Storybook, which is an open-source tool for developing UI components in isolation for React, Vue, Angular, and more. It provides a set of APIs that allow developers to interact with Storybook's internal state and methods, enabling them to create custom addons and tools that can enhance the Storybook experience.

What are @storybook/api's main functionalities?

useStorybookApi

This hook allows you to access the Storybook API within your components or addons to interact with Storybook's state and functions, such as selecting a specific story.

import { useStorybookApi } from '@storybook/api';
const api = useStorybookApi();
api.selectStory('component-id');

useAddonState

This hook is used to persist state across the Storybook UI. It's useful for addons that need to maintain state.

import { useAddonState } from '@storybook/api';
const [state, setState] = useAddonState('your-addon-id', initialState);

useParameter

This hook allows you to retrieve the value of a parameter passed to a story, which can be used to customize the behavior of an addon.

import { useParameter } from '@storybook/api';
const parameter = useParameter('parameterName', defaultValue);

Other packages similar to @storybook/api

react-cosmos

React Cosmos is a development tool that allows you to build and test reusable React components. It is similar to Storybook in that it provides an isolated environment to develop components, but it does not offer the same addon API for extending its functionality.

docz

Docz is a documentation tool that leverages MDX to help you document your components. While it provides a way to showcase components similar to Storybook, it does not have an extensive API for creating addons or interacting with the tool's internal state.

README

The contents of this package have moved to @storybook/manager-api. Please update your import.

This package will no longer be released as part of the 8.0 release of storybook.